import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:xinxuan/common/button_util.dart';
import 'package:xinxuan/common/network_image_util.dart';
import 'package:xinxuan/router/app_routers.dart';
import 'package:xinxuan/utils/color_util.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:xinxuan/vo/good_item_vo.dart';
import 'package:get/get.dart';

/// 精选好物商品列表
class CullingGoodsArr extends StatelessWidget {

  final List<GoodItem> goodsArr;
  CullingGoodsArr({ required this.goodsArr });

  @override
  Widget build(BuildContext context) {
    return goodsArr.length <= 0 ? Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        SizedBox(height: 32.h),
        Image.asset(
          'assets/icons/goods_list_def.png',
          width: 221.w,
          height: 118.h,
        ),
        Text(
          '暂无相关数据哦~',
          style: TextStyle(
            color: textSubtitleColor,
            fontSize: 14.sp
          ),
        )
      ],
    ) : 
    Container(
      padding: EdgeInsets.symmetric(horizontal: 16.w),
      child: StaggeredGridView.countBuilder(
        padding: EdgeInsets.zero,
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        crossAxisCount: 4,
        itemCount: goodsArr.length,
        staggeredTileBuilder: (int index) => StaggeredTile.fit(2),
        mainAxisSpacing: 12.h,
        crossAxisSpacing: 13.w,
        itemBuilder: (BuildContext context, int index) {
          GoodItem item = goodsArr[index];
          return Container(
            width: 165.w,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(5.w),
              color: bgWhiteColor
            ),
            child: Column(
              children: [
                NetworkImageUtil(
                  url: item.thumbnail ?? '', 
                  width: 165.w, 
                  height: 165.w,
                  topLeftRadius: 5.w,
                  topRightRadius: 5.w,
                ),
                SizedBox(height: 12.h),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 6.w),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        item.title ?? '',
                        overflow: TextOverflow.ellipsis,
                        maxLines: 2,
                        style: TextStyle(
                          color: textBlackColor,
                          fontSize: 14.sp,
                          fontWeight: FontWeight.bold
                        ),
                        textScaleFactor: 1.0,
                      ),
                      SizedBox(height: 3.h),
                      Text.rich(
                        TextSpan(
                          text: '¥',
                          style: TextStyle(
                            color: mainTextColor,
                            fontWeight: FontWeight.bold,
                            fontSize: 14.sp
                          ),
                          children: [
                            TextSpan(
                              text: item.price,
                              style: TextStyle(
                                color: mainTextColor,
                                fontWeight: FontWeight.bold,
                                fontSize: 18.sp
                              ),
                            )
                          ]
                        )
                      ),
                      SizedBox(height: 3.h),
                      Text(
                        '¥${item.marketPrice}',
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                          color: textSubtitleColor,
                          fontWeight: FontWeight.bold,
                          fontSize: 12.sp,
                          decoration: TextDecoration.lineThrough,
                        ),
                      ),
                      SizedBox(height: 12.h),
                      ButtonUtil(
                        text: '去抢购', 
                        fontSize: 14.sp, 
                        borderRadius: 20.w, 
                        height: 30.h,
                        onTop: () {
                          Get.toNamed(
                            '${AppRouters.COMMON_PAGE}${AppRouters.GOOD_DETAIL_PAGE}',
                            arguments: {
                              'goodId': item.id
                            }
                          );
                        }, 
                      ),
                      SizedBox(height: 12.h),
                    ],
                  ),
                )
              ],
            ),
          );
        },
      ),
    );
  }
}